<template>
	<view class="quickCare">
		<navBar :title="$t('home.Luxury-care')"></navBar>
		<view class="big-img flex_col_center">
			<image style="width:186rpx;height: 231rpx;margin-bottom: 109rpx;" src="/static/image/care_02.png"></image>
			<view>{{$t('home.estimate50min')}}</view>
		</view>

		<view class="btn w_90 yx" @click="toCareing">{{$t('home.run')}}</view>
		<view class="reserve" @click="openTimePicker">{{$t('home.reservation')}}</view>

		<!-- 打开时间选择器 -->
		<CustomPicker ref="customTimePicker" @confirm="hanleConfirm"></CustomPicker>

		<!-- 加载中弹窗 -->
		<uni-popup ref="popup" :mask-click="false"></uni-popup>

	</view>


</template>

<script>
	import CustomPicker from '@/componets/CustomPicker.vue';
	import {
		setDeviceWorkMode,
		createDeviceScheduleTask
	} from '@/api/home.js'
	import {
		pushTemplate
	} from "@/utils/util.js"
	export default {
		components: {
			CustomPicker
		},
		data() {
			return {
				time: '12:01',
				selectedTime: '',
				sn: '',
				mode: 4,
				pickerShow: false
			};
		},
		onLoad(options) {
			this.sn = options.sn;
		},
		methods: {
			// 设备运行
			toCareing() {
				// this.$refs.popup.open();
				uni.showLoading({
					title: this.$t('loading')
				});
				pushTemplate().then(() => {
					setDeviceWorkMode({
						sn: this.sn,
						mode: this.mode, //丝绸护理
					}).then((r) => {
						// this.config.Toast('修改成功');
						console.log('运行', r)
						if (r.code == 0) {
							// 隐藏加载提示
							uni.hideLoading();
							// this.$refs.popup.close()
							// this.config.path('/pagesA/home/quickCare/careing?sn=' + this.sn);
							uni.setStorageSync('careSn', this.sn);
							uni.switchTab({
								url: '/pages/home/home'
							});
						} else {
							uni.hideLoading();
						}
					}).catch(err => {
						this.config.Toast(err.message);
						// uni.hideLoading();
						this.$refs.popup.close()
					})
				})

			},
			openTimePicker() {
				this.$refs.customTimePicker.open();
			},
			// 预约时间确认
			hanleConfirm(time) {
				let yyTimer = this.config.formatTimeWithDate(time)
				createDeviceScheduleTask({
					sn: this.sn,
					mode: this.mode,
					executeTime: yyTimer
				}).then((r) => {
					if (r.code === 0) {
						this.config.Toast(this.$t('Appointment.successful'));
						setTimeout(() => {
							uni.switchTab({
								url: '/pages/device/device'
							})
						}, 1500)
					} else {
						this.config.Toast(r.message);
					}
				}).catch(err => {})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.quickCare {
		.big-img {
			background: #fff;
			width: 90%;
			margin: 40rpx auto;
			height: 789rpx;
			border-radius: 40rpx;
			color: $uni-theme-color;
		}
	}
</style>